/**
 * @Description:
 * @Author: CHEHSHUANG
 * @Date: 2019/3/15
 */
import React, {Component} from 'react';
import SimpleTable from "../../../commons/components/SimpleTable";
import StandardDropdown from "../../../commons/components/StandardDropdown";
import ApproveHistory from '../../../commons/components/ApproveHistory';
import {rollBackTo} from '../service';
import {Modal,Input,message} from 'antd';
import {mainTabAction} from 'sei-utils';

const confirm = Modal.confirm
const { TextArea } = Input;
class CompleteTask extends Component {


  state={
    historyKey:'',
  }

  opinion='';

  opinionChange = (e) => {
    this.opinion=e.target.value;
  }

  handleHistory = (record) => {
    this.setState({historyKey:record.flowInstance.businessId})
  }

  setHistoryKey=(id)=>{
    this.setState({historyKey:id})
  }

  handleDetail = (data) =>{
    let uri = data.flowInstance.flowDefVersion.flowDefination.flowType.lookUrl;
    if (!uri) {
      uri = data.flowInstance.flowDefVersion.flowDefination.flowType.businessModel.lookUrl;
    }
    let url = data.webBaseAddressAbsolute.replace(/\/$/g,'')+'/'+uri.replace(/^\//g,'');
    if(url.indexOf('?') === -1){
      url=`${url}?id=${data.flowInstance.businessId}`
    } else {
      url=`${url}&id=${data.flowInstance.businessId}`
    }
    mainTabAction.tabOpen({id:data.flowInstance.businessId,name:'查看表单',featureUrl:url})
  }

  drawBack=(record)=>{
    let thiz = this
    confirm({
      title:'撤回原因',
      content: <TextArea placeholder={'请填写撤回原因'} onChange={thiz.opinionChange} rows={2} />,
      onOk: () => {
        if (!this.opinion || this.opinion.trim() === '') {
          message.error('请填写撤回原因')
          return;
        }
        rollBackTo(record.id,thiz.opinion).then(res=>{
          if(res.status==='SUCCESS'){
            message.success('流程撤回成功');
            thiz.opinion=''
            this.props.refresh()
          }else{
            message.error(res.message)
          }
        })
      },
      onCancel: ()=>{
        thiz.opinion=''
      }
    });
  }


  getColumns = () => {
    return [
      {
        title: "操作",
        width: 120,
        dataIndex: "operator",
        render: (text, record, index) => {
          const buttons = [];
          if(record.canCancel==true&&record.taskStatus == "COMPLETED"&&record.flowInstance.ended == false){
            buttons.push(<a className={'row-operator-item'} key="drawBack" onClick={() => this.drawBack(record)}>撤回</a>)
          }
          buttons.push( <a className={'row-operator-item'} key="detail" onClick={() => this.handleDetail(record)}>查看</a>,
          <a className={'row-operator-item'} key="history" onClick={() => this.handleHistory(record)}>流程历史</a>)
          return (
            <div className={'row-operator'} onClick={(e) => {
              e.stopPropagation()
            }}>
              <StandardDropdown
                operator={buttons}
              />
            </div>
          )
        }
      },
      {
        title: '流程名称',
        width: 200,
        dataIndex: 'flowName',
        render: (text, record, index) => {
          if (text) {
            return <span title={text}>{text}</span>;
          }
          return null;
        }
      },
      {
        title: '任务名称',
        dataIndex: 'flowTaskName',
        width: 200,
        render: (text, record, index) => {
          if (text) {
            return <span title={text}>{text}</span>;
          }
          return null;
        }
      },
      {
        title: '单号',
        dataIndex: 'businessCode',
        width: 110,
        render: (text, record, index) => {
          if (record) {
            const res = `${record.flowInstance?record.flowInstance.businessCode:""}`;
            return <span title={res}>{res}</span>;
          }
          return null;
        }
      },
      {
        title: '说明',
        dataIndex: 'businessModelRemark',
        width: 250,
        render: (text, record, index) => {
          if (record) {
            const res = `${record.flowInstance?record.flowInstance.businessModelRemark:""}`;
            return <span title={res}>{res}</span>;
          }
          return null;
        }
      },
      {
        title: '任务发起人',
        dataIndex: 'creatorName',
        width: 200,
        render: (text, record, index) => {
          if (record) {
            const res = `${record.creatorName }【${record.creatorAccount}】`;
            return <span title={res}>{res}</span>;
          }
          return null;
        }
      },
      {
        title: '处理时间',
        dataIndex: 'lastEditedDate',
        width: 200,
        render: (text, record, index) => {
            return <span title={text}>{text}</span>;
        }
      }
    ];
  }

  render() {
    const {selectedRows, dataSource,handleRowSelectChange,handlePageChange, visible=false} = this.props;
    return (
      <>
        {visible && <SimpleTable
          rowsSelected={selectedRows}
          rowKey={'businessId'}
          onSelectRow={handleRowSelectChange}
          data={dataSource}
          columns={this.getColumns()}
          pageChange={handlePageChange}
        />}
        <ApproveHistory historyKey={this.state.historyKey} setHistoryKey={this.setHistoryKey}/>
      </>
    );
  }
}

export default CompleteTask;
